<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>火币公告</title>
  <!-- title前面小图标 -->
  <link rel="shortcut icon" type="image/x-icon" href="public/images/huobi.png" />
  <!-- 新 Bootstrap 核心 CSS 文件 -->
  <link href="public/css/bootstrap.min.css" rel="stylesheet" />
  <!-- jQuery文件。务必在bootstrap.min.js 之前引入 -->
  <script src="public/js/jquery.min.js"></script>
  <!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
  <script src="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>
  <!-- 样式表-->
  <link href="public/css/index.css" rel="stylesheet">
  <link href="public/css/request.css" rel="stylesheet">
  <!-- Vue的配置 -->
  <script src="https://cdn.jsdelivr.net/npm/vue"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.1.8/vue.min.js"></script>
</head>

<body>
  <!-- 头部内容 -->
  <div class="row clearfix">
    <div class="col-md-12 column">
      <header class="header">
        <!-- logo -->
        <div class="logo">
          <img src="public/images/logo.png" />
        </div>
        <div class="nav-wrapper">
          <span class="icon-menu"></span>
          <nav class="user-nav" id="user-nav">
            <a class="submit-a-request" href="SubmitRequests.html">提交请求</a>
          </nav>
        </div>
      </header>
    </div>
  </div>
  <!-- 中间主体内容部分 -->
  <main role="main">
    <div class="container-divider"></div>
    <div class="container">
      <nav class="sub-nav">
        <ol class="breadcrumbs">
          <li title="帮助中心">
            <a href="index.html">帮助中心</a>
          </li>
          <li title="Huobi Global 公告">
            Huobi Global 公告
          </li>
        </ol>
        <!-- 搜索 -->
        <div role="search" class="search " data-search="" data-instant="true" autocomplete="off">
          <input name="" type="hidden" value="">
          <input type="search" name="" id="query" autocomplete="off" placeholder="搜索" 
            aria-label="搜索">
        </div>
      </nav>

      <div class="category-container">
        <div class="category-content">
          <h1 id="parentname">Huobi Global 公告</h1>
          <div class="section-tree" id="category">
            <section class="section" v-for="(item,key) in datas" :key="key">
              <div>
                <h3 class="section-tree-title">
                  <a onclick="Category(this)" href="important.html"
                    v-bind:name="item.category.categoryId">{{item.category.cname}}</a>
                </h3>
                <ul class="article-list" v-for="itemList in item.articles" :key="itemList.articleid">
                  <li class="article-list-item article-promoted">
                    <div v-if="itemList.recommend==='on'" style="display: inline-block">
                      <span data-title="被推荐的文章" class="icon-star"></span></div>

                    <a onclick="article(this)" href="article.html" v-bind:name="itemList.articleid"
                      class="article-list-link">{{itemList.title}}</a>
                  </li>
                </ul>
                <a href="#" class="see-all-articles">
                  查看所有{{item.articleCount}}篇文章
                </a>
              </div>
            </section>
          </div>
        </div>
      </div>
  </main>
  </div>
  <!-- 底部内容 -->
  <footer class="footer">
    <div class="footer-inner">
      <a title="主页" href="#">帮助中心</a>
      <!-- 语言内容 -->
      <div class="footer-language-selector">
        <div class="dropdown language-selector" aria-haspopup="true">
          <div class="row clearfix">
            <div class="col-md-12 column">
              <div class="btn-group dropup">
                <a class="yuyan" data-toggle="dropdown" style="color:#4f6d8c ;border: none">简体中文<img
                    src="public/images/xiangxia.svg" /></a>
                <ul class="dropdown-menu" style="margin-left: -50px;">
                  <li>
                    <a href="#"> Deutsch</a>
                  </li>
                  <li>
                    <a href="#"> English (US)</a>
                  </li>
                  <li>
                    <a href="#">Español</a>
                  </li>
                  <li>
                    <a href="#"> Français</a>
                  </li>
                  <li>
                    <a href="#">日本語</a>
                  </li>
                  <li>
                    <a href="#">한국어</a>
                  </li>
                  <li>
                    <a href="#">Português</a>
                  </li>
                  <li>
                    <a href="#"> Русский</a>
                  </li>
                  <li>
                    <a href="#"> Türkçe</a>
                  </li>
                  <li>
                    <a href="#">Tiếng Việt</a>
                  </li>
                  <li>
                    <a href="#">繁體中文</a>
                  </li>
                </ul>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </footer>
  <!-- js代码 -->
  <script type="text/javascript">
    $(function () {
      // 公告的方法
      category();
      var parentname = window.localStorage.getItem("parentname");
      $("#parentname").html(parentname);

    })
    // 公告ajax
    function category() {
      //得到id
      var id = window.localStorage.getItem("id");
      $.ajax({
        url: "http://192.168.137.1:5001/api/values/Category?id=" + id,
        type: "post",
        dataType: "json",
        success: function (result) {
          new Vue({
            el: "#category",
            data: {
              datas: result
            }
          })
        },
        error: function () {
          // alert("执行失败");
        }
      })
    }
    // 根据栏目id跳转
    function Category(params) {
      //存储的数据
      var str = $(params).attr("name");
      var name = params.innerText;
      //id是参数的名字
      window.localStorage.setItem("Categoryid", str);
      window.localStorage.setItem("cname", name);
    }

    function article(params) {
      var strs = $(params).attr("name");
      var names = params.innerText;
      var cateid = $(params).parents("section.section").children("div").children("h3").children("a").attr("name");
      window.localStorage.setItem("articleid", strs);
      window.localStorage.setItem("articletitle", names);
      window.localStorage.setItem("Categoryid", cateid);
    }
    var query; //定义全局变量
    // 搜索enter键按下事件
    $('#query').keydown(function () {
      if (event.keyCode == "13") {
        //获取文本框里面的值
        query = $("#query").val();
        location.href = "search.html#" + query;

      }
    })
  </script>
</body>

</html>